.editor__container {
  // 编辑器全局样式
  .ProseMirror {
    outline: none;

    strong {
      font-weight: bold;
    }

    h2 {
      line-height: 2rem;
    }

    .paragraph {
      margin-bottom: 8px;
    }

    // 分割线
    hr.ProseMirror-selectednode {
      border-top: 1px solid #68cef8;
    }

    // 默认文案
    p.is-editor-empty:first-child::before {
      font-family: sans-serif;
      color: #adb5bd;
      content: attr(data-placeholder);
      float: left;
      height: 0;
      pointer-events: none;
    }

    // 引用块
    blockquote {
      border-left: 3px solid rgba(#0d0d0d, 0.1);
      padding-left: 1rem;
    }

    // 无序/有序列表
    ul,
    ol {
      padding: 0 1rem;
    }

    // 高亮
    mark {
      background-color: #ffe066;
      border-radius: 0.25em;
      box-decoration-break: clone;
      padding: 0.125em 0;
    }

    // 代码
    code {
      background-color: rgba(#616161, 0.16);
      border-radius: 0.25em;
      box-decoration-break: clone;
      color: #616161;
      font-size: 0.9rem;
      padding: 0.25em;
    }

    // 任务列表
    ul[data-type='taskList'] {
      list-style: none;
      padding: 0;

      p {
        margin: 0;
      }

      li {
        display: flex;

        > label {
          flex: 0 0 auto;
          margin-right: 0.5rem;
          user-select: none;
        }

        > div {
          flex: 1 1 auto;
        }

        ul li,
        ol li {
          display: list-item;
        }

        ul[data-type='taskList'] > li {
          display: flex;
        }
      }
    }

    // 代码块
    pre {
      background: #0d0d0d;
      border-radius: 0.5rem;
      color: #fff;
      font-family: 'JetBrainsMono', monospace;
      padding: 0.75rem 1rem;

      code {
        background: none;
        color: inherit;
        font-size: 0.8rem;
        padding: 0;
      }

      .hljs-comment,
      .hljs-quote {
        color: #616161;
      }

      .hljs-variable,
      .hljs-template-variable,
      .hljs-attribute,
      .hljs-tag,
      .hljs-name,
      .hljs-regexp,
      .hljs-link,
      .hljs-name,
      .hljs-selector-id,
      .hljs-selector-class {
        color: #f98181;
      }

      .hljs-number,
      .hljs-meta,
      .hljs-built_in,
      .hljs-builtin-name,
      .hljs-literal,
      .hljs-type,
      .hljs-params {
        color: #fbbc88;
      }

      .hljs-string,
      .hljs-symbol,
      .hljs-bullet {
        color: #b9f18d;
      }

      .hljs-title,
      .hljs-section {
        color: #faf594;
      }

      .hljs-keyword,
      .hljs-selector-tag {
        color: #70cff8;
      }

      .hljs-emphasis {
        font-style: italic;
      }

      .hljs-strong {
        font-weight: 700;
      }
    }
  }
}
